<template>
  <div class="box">
    <div id="videoBox"></div>
  </div>
</template>

<script>
import Player from "xgplayer";
import xgplayerFlv from "xgplayer-flv";
import HlsJsPlayer from "xgplayer-hls.js";
export default {
  data() {
    return {
      video: null,
    };
  },
  mounted() {
    this.init();
  },

  methods: {
    init() {
      this.video = new HlsJsPlayer({
        el: document.getElementById("videoBox"),
        // url: require("../assets/video/video.mp4"),
        //网络视频
        // url: "http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4",
        // url: "rtsp://wowzaec2demo.streamlock.net/vod/mp4:BigBuckBunny_115k.mp4",

        // 直播
        url: "http://hls.cntv.lxdns.com/asp/hls/main/0303000a/3/default/978a64ddd3a1caa85ae70a23414e6540/main.m3u8",
        // autoplay: true,
        // loop: true,
        playsinline: true,
        width: "100%", // 播放器宽度
        height: "600px", // 播放器高度
        poster: require("@/assets/img/banner.f559b49d.png"),

        playbackRate: [0.5, 0.75, 1, 1.5, 2],
        defaultPlaybackRate: 1.5,
        // isLive: true,
        videoInit: true,
        cors: true,
      });
    },
  },
};
</script>

<style>
</style>